@mixin btn-border($background-color) {
    background-color: $background-color;
    border-color: $background-color !important;

    .x-btn-inner-default-toolbar-small {
        color: $lightest-color;
    }

    &:hover {
        background-color: transparent;

        .x-btn-inner-default-toolbar-small,
        .x-btn-inner-default-small {
            color: $background-color;
        }

        .x-btn-icon-el-default-small,
        .x-btn-icon-el-default-toolbar-small {
            color: $background-color;
        }
    }
}

@mixin border-radius($radius) {
    -webkit-border-radius: $radius;
    -moz-border-radius: $radius;
    -ms-border-radius: $radius;
    border-radius: $radius;
}

@mixin box-shadow($h-shadow, $v-shadow, $blur, $spread, $shadow-color) {
    $value: $h-shadow, $v-shadow, $blur, $spread, $shadow-color;
    -webkit-box-shadow: $value;
    -moz-box-shadow: $value;
    -ms-box-shadow: $value;
    box-shadow: $value;
}

.x-menu-header {
    z-index: 0 !important;
}

.x-css-shadow{
    box-shadow: none !important;
}

.shadow {
    @include box-shadow(0 1px 2px 0 rgba(0,0,0,0.2));
}

.alignRight {
    float: right;
}

.boldFont {
    font-weight: bold;
}

//自定义表格 单元格内图标样式
.user-grid .x-action-col-icon.x-fa {
    height: 20px;
    width: 20px;
    background: $grid-item-edit-btn-color;
    line-height: 20px;
    float: left;
    margin-right: 10px;

    &:before {
        display: block;
        line-height: 20px;
        text-align: center;
    }

    &.fa-times{
        background-color: $grid-item-close-btn-color;
        color: $lightest-color;
    }

    &.fa-ban{
        background-color: $grid-item-ban-btn-color;
        color: $lightest-color;
    }

    &.fa-pencil-alt{
        background-color: #9cc96b;
        color: $lightest-color;
    }

    &.fa-table{
        background-color: #ffc000;
        color: $lightest-color;
    }

    &.fa-file{
        background-color: #579ddb;
        color: $lightest-color;
    }

    &.fa-eye{
        background-color: #ffc000;
        color: $lightest-color;
    }

    &.x-action-col-icon{
        font-size: 13px !important;
    }
}

//定义表格样式
.user-grid {
    .x-grid-td {
        //表格中内容垂直居中
        vertical-align: middle;
        //表格中图片圆角50度
        img {
            @include border-radius($circle-border-radius);
        }
    }
    //表格边框1像素
    .x-grid-body {
        border-width: 1px;
    }
}

.x-action-col-icon {
    font-size: 13px !important;
}

//自定义消息弹窗样式PopupMsg.css
#msg-div {
    position:absolute;
    left:50%;
    top:10px;
    width:300px;
    margin-left:-150px;
    z-index:20000;
}
#msg-div .msg {
    border-radius: 8px;
    -moz-border-radius: 8px;
    background: #F6F6F6;
    border: 2px solid #ccc;
    margin-top: 2px;
    padding: 10px 15px;
    color: #555;
}
#msg-div .msg h3 {
    margin: 0 0 8px;
    font-weight: bold;
    font-size: 15px;
}
#msg-div .msg p {
    margin: 0;
}

//自定首页Logo-Websocket图标样式
.x-fa {
    &.fa-rss  {
        &.green{color: #86c747};
    }
}

//隐藏FusionChart图表水印样式
.basefusionchart-hidden {
    visibility: hidden !important;
}

//extjs 分组统计数据行字体加粗
.x-grid-row-summary .x-grid-cell-inner {
    font-weight: bold;
}